<template>
  <uni-popup ref="popup" type="center" style="z-index: 910">
    <view class="nominate">
      <view class="space-between top">
        <view class="center">
          <image :src="userInfor.avatar" mode=""></image>
          {{userInfor.nickname}}({{userInfor.driver_id}})
        </view>
        <view v-if="userInfor.zhitui_name">直推人：{{userInfor.zhitui_name}}</view>
      </view>
      <view class="space-between but">
        <view>贡献金额：{{userInfor.staff_driver_withdrawal}}</view>
        <view>待释放金额：{{userInfor.staff_driver_freeze}}</view>
        <view>直推释放比例：{{userInfor.zhitui_bfb}}</view>
        <view>间推释放比例：{{userInfor.jiantui_bfb}}</view>
      </view>
    </view>
  </uni-popup>
</template>

<script setup lang="ts">
  import { ref } from 'vue';
  const popup = ref(null)
  const props = defineProps({
    userInfor: {
      type: Object
    },
  });
  // setTimeout(() => {
  //   open()
  // }, 1000)
  function open() {
    popup.value.open();
  }
  function close() {
    popup.value.close();
  }
  defineExpose({
    open,
    close,
  });
</script>

<style scoped lang="less">
  .nominate {
    width: 600rpx;
    background: #FFFFFF;
    border-radius: 5px;
    overflow: hidden;

    .top {
      width: 100%;
      height: 108rpx;
      background: #558AF1;
      padding: 0px 20rpx;
      box-sizing: border-box;
      color: #FFFFFF;

      image {
        width: 60rpx;
        height: 60rpx;
        background: #FFFFFF;
        border-radius: 50%;
        margin-right: 10rpx;
      }
    }

    .but {
      flex-wrap: wrap;
      padding: 30rpx 20rpx 10rpx;
      box-sizing: border-box;

      view {
        margin-bottom: 20rpx;
        font-size: 26rpx;
      }
    }
  }
</style>